<script lang="jsx" setup>
import { ref } from 'vue';
import Form from '@/components/common/form.vue';
import { getModelList } from '@/service/api/modules/workwear/mold-maintenance';

const props = defineProps({
  rowData: {
    type: Object,
    default: () => null
  },
  operateType: {
    type: String,
    default: () => 'add'
  }
});

const formList = [
  {
    type: 'tabs',
    name: '基本项目',
    span: 24
  },

  {
    type: 'input',
    key: 'moldNo',
    label: '模具型号',
    placeholder: '请输入模具型号',
    span: 8,
    rule: {
      required: true,
      message: '请输入模具型号',
      trigger: 'blur'
    }
  },

  {
    type: 'select',
    key: 'moldType',
    label: '模具类型',
    placeholder: '请选择模具类型',
    span: 8,
    rule: {
      required: true,
      message: '请选择模具类型',
      trigger: 'change'
    },
    selectOptions: [
      {
        value: 1,
        label: '软模'
      },
      {
        value: 2,
        label: '硬模'
      }
    ]
  },

  {
    type: 'select',
    key: 'applyType',
    label: '申请类型',
    placeholder: '请选择申请类型',
    span: 8,
    rule: {
      required: true,
      message: '请选择申请类型',
      trigger: 'change'
    },
    selectOptions: [
      {
        value: 1,
        label: '新开'
      },
      {
        value: 2,
        label: '重开'
      }
    ]
  },

  {
    type: 'input',
    key: 'moldAddress',
    label: '存放位置',
    placeholder: '请输入存放位置',
    span: 8
  },

  {
    type: 'input',
    key: 'boardMaterial',
    label: '板材',
    placeholder: '请选择板材',
    span: 8,
    selectOptions: [
      {
        value: 'FR-1',
        label: 'FR-1'
      },
      {
        value: 'CEM-1',
        label: 'CEM-1'
      },
      {
        value: 'FR-4',
        label: 'FR-4'
      },
      {
        value: 'CEM-3',
        label: 'CEM-3'
      }
    ]
  },

  {
    type: 'input',
    key: 'boardThick',
    label: '板厚(MM)',
    placeholder: '请输入板厚(MM)',
    span: 8
  },

  {
    type: 'datePicker',
    key: 'moldInDate',
    label: '入厂日期',
    placeholder: '请输入入厂日期',
    span: 8
  },

  {
    type: 'input',
    key: 'supplier',
    label: '供应商',
    placeholder: '请输入供应商',
    span: 8
  },

  {
    type: 'textarea',
    key: 'remark',
    label: '备注',
    placeholder: '请输入备注',
    span: 8,
    textareaRows: 1
  }
];

function getModel() {
  const obj = {};
  formList.forEach(item => {
    if (item.key && item.span) {
      if (props.operateType === 'add') {
        obj[item.key] = null;
      } else {
        obj[item.key] = props.rowData[item.key];
      }
    }
  });
  return obj;
}
const formRef = ref(null);

const model = ref(getModel());

function validateForm() {
  return formRef.value.validateForm();
}

defineExpose({
  model: model.value,
  validateForm
});
</script>

<template>
  <div class="event-form">
    <Form ref="formRef" v-model:model="model" :form-list="formList"></Form>
  </div>
</template>

<style lang="scss" scoped></style>
